<script setup>
import { onMounted, computed, ref } from "vue";
import { useStore } from "vuex";

const store = useStore();
let gongkaikexq = computed(() => store.state.gongkaike.listxq);

    const onClickLeft = () => history.back();
</script>

<template>
    <van-nav-bar :fixed="true" :placeholder="true" title="公开课详情" left-arrow @click-left="onClickLeft" />
    <div class="gke">
          <img :src="gongkaikexq.avatar" alt="" />
          
          <div class="gke-one"><span>{{gongkaikexq.name}}</span><span>{{gongkaikexq.entryFee}}</span></div>
          <div class="gke-rs"><span>上课时间: 报名成功后即可观看</span><span>已报名{{gongkaikexq.num}}人</span></div>
    </div>
    <div class="text">
      <h3>课程介绍</h3>
      <ul>
          <li>适合对象</li>
          <li>三年级学员</li>
          <li>培训目标</li>
          <li>达到剑桥欧标A1+的水平 从听说读写全面锻炼英语能力</li>
      </ul>
      <h4>教师简介</h4>
      <h5>姓名：<span>张颖</span></h5>
      <h4>教学成果</h4>
      <span
        >培养了孩子有效的学习方法和习惯，并使之成绩普遍提高，在我的循循善诱下，使得其举一反三，对知识点的吸收更为迅速，深得学生喜爱和家长的认可。无论是新生还是老学员，在纪老师的引导下孩子们对数学产生了极大的兴趣，有自主学习的动力，成绩提高非常明显。</span
      >
      <h4>教学经验</h4>
      <span
        >大学期间就开始了学科辅导，再加上本科四年对自己专业（数学与应用数学）的认真学习，对每个知识点都有深刻的理解，能够引导孩子主动发现问题、思考问题、解决问题。</span
      >
      <h4>教学特点</h4>
      <span
        >逻辑清晰，善于抓住解题重点，引导学生举一反三，注重培养孩子思维发散和逻辑能力。善于引导,让孩子们在学习中获得快乐。</span
      >
    </div>
    <van-button type="primary" block>立即报名</van-button>
</template>



<style  scoped>
.text {
  padding: 20px 10px 30px 10px;
}
.gke-one{
    padding: 10px 5px;
}
.gke-one > span:last-child {
    padding-left: 30px;
  color: red;
}
.gke-rs {
  padding: 10px 5px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}
.gke-rs > span:first-child {
  color: darkgray;
}
.gke-rs > span:last-child {
    padding-right: 50px;
  color: red;
}
.gke img {
  margin: 0 auto;
  width: 100px;
  display: block;
}
.gke > span {
  font-size: 16px;
  padding: 10px 5px;
  display: block;
}
.gke {
  padding: 6px 3px;
  width: 100%;
  border-bottom: 10px solid darkgray;
}
</style>